<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>账户设置-博客园</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/bmz-account.css">
</head>

<body>
    <!-- 外面最大的盒子 -->
    <div class="account">
        <!-- 1. 头部导航栏 -->
        <div class="account-nav clearfix">
            <div class="account-nav-right">
                <a href="javascript:;">首页</a>
                <a href="javascript:;">新闻</a>
                <a href="javascript:;">找找看</a>
                <a href="javascript:;">学习计划</a>
            </div>
        </div>

        <!-- 2.设置 -->
        <div class="setting">
            <!-- 版心公共部分 -->
            <div class="account-common">
                <!-- 2.1 最大盒子 -->
                <div class="account-middle">
                    <!-- 2.2 上半部分 -->
                    <div class="setting-top clearfix">
                        <!-- 2.2.1 左边部分 -->
                        <div class="setting-top-left">
                            <a href="javascript:;">园子</a>
                            ·
                            <a href="javascript:;">关注</a>
                            ·
                            <a href="javascript:;">粉丝</a>
                            ·
                            <a href="javascript:;">随便看看</a>
                            ·
                            <a href="javascript:;">消息</a>
                        </div>
                        <!-- 2.2.2 右边部分 -->
                        <div class="setting-top-right">
                            <img src="./images/bmz/bmz-01.png" alt="">
                        </div>
                    </div>
                    <!-- 2.3 下半部分 -->
                    <div class="setting-bottom clearfix">
                        <!-- 2.3.1 下半部分左边 -->
                        <div class="setting-bottom-left">
                            <h1>欢迎你，木子阿</h1>
                        </div>
                        <!-- 2.3.2 下半部分右边 -->
                        <div class="setting-bottom-right">
                            <img src="./images/bmz/bmz-02.jpg" alt="">
                            <a href="javascript:;">木子阿</a>
                            ·
                            <a href="javascript:;">我的博客</a>
                            ·
                            <a href="javascript:;">设置</a>
                            ·
                            <a href="javascript:;">退出</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 3.中间信息版本 -->
        <div class="message">
            <!-- 版心 -->
            <div class="account-common clearfix">
                <!-- 3.1 信息左边 -->
                <div class="message-left clearfix">
                    <ul>
                        <li>
                            <img src="./images/bmz/bmz-03.gif" alt="">
                            <a href="javascript:;">闪存</a>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-04.gif" alt="">
                            <a href="javascript:;">博客</a>
                            <i>写博</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-05.gif" alt="">
                            <a href="javascript:;">小组</a>
                            <i>发言</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-06.gif" alt="">
                            <a href="javascript:;">新闻</a>
                            <i>投递</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-07.gif" alt="">
                            <a href="javascript:;">博问</a>
                            <i>提问</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-08.gif" alt="">
                            <a href="javascript:;">收藏</a>
                            <i>添加</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-09.gif" alt="">
                            <a href="javascript:;">招聘</a>
                            <i>发布</i>
                        </li>
                        <li>
                            <img src="./images/bmz/bmz-10.gif" alt="">
                            <a href="javascript:;">文库</a>
                        </li>
                        <p class="feedback">问题反馈</p>
                    </ul>
                </div>
                <!-- 3.2 信息右边 -->
                <div class="message-right">
                    <!-- 3.2.1 头部 -->
                    <div class="message-right-top">
                        <ul>
                            <li><a href="">上传头像</a></li>
                            <li class="active"><a href="">账户设置</a></li>
                            <li><a href="">基本资料</a></li>
                            <li><a href="">个人信息</a></li>
                            <li><a href="">联系方式</a></li>
                            <li><a href="">博客设置</a></li>
                        </ul>
                    </div>
                    <!-- 3.2.2 修改信息 -->
                    <div class="amend">

                        <div class="username">
                            <h3 class="clearfix">登录用户名
                                <a href="javascript:;" class="modifier">修改</a>
                            </h3>

                            <!-- 3.2.3 修改 -->
                            <div class="amend-bottom">
                                <span class="title">您的登录用户名</span>
                                <span class="title-i">木子呵</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot">
                                <span class="newlogin">新登录用户名: </span>
                                <input type="text" placeholder="4-30个字符" id="price"><br>
                                <button id="conserve">保存</button>
                                <button class="cancel">取消</button>
                            </div>
                        </div>



                        <!-- 2 -->
                        <div class="username" id="twoa">
                            <h3 class="clearfix">密码
                                <a href="javascript:;" class="modifier" id="twob">修改</a>
                            </h3>
                            <div class="amend-bottom" id="teo">
                                <span class="title">您的密码</span>
                                <span class="title-i">******</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot" id="twoc">
                                旧&nbsp;密&nbsp;码:&nbsp; &nbsp;<input type="password" name="" id=""><br>
                                新&nbsp;密&nbsp;码:&nbsp; &nbsp;<input type="password" name="" id="">
                                8-30个字符，必须包含字母,数字,特殊字符
                                <br>
                                确认密码: &nbsp;<input type="password" name="" id=""><br>
                                <button id="conserve">保存</button>
                                <button id="twod">取消</button>
                            </div>
                        </div>

                        <!-- 3 -->
                        <div class="username" id="thr">
                            <h3 class="clearfix">显示名称
                                <a href="javascript:;" id="thl">修改</a>
                            </h3>
                            <div class="amend-bottom" id="thra">
                                <span class="title">您的显示名称</span>
                                <span class="title-i">木子呵</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot" id="thrb">
                                <span class="newlogin">新登录用户名: </span>
                                <input type="text" placeholder="4-30个字符"><br>
                                <button id="conserve">保存</button>
                                <button class="cancel" id="thx">取消</button>
                            </div>
                        </div>

                        <!-- 4 -->
                        <div class="username" id="for">
                            <h3 class="clearfix">注册邮箱
                                <a href="javascript:;" id="fore">修改</a>
                            </h3>
                            <div class="amend-bottom" id="fora">
                                <span class="title">您的注册邮箱</span>
                                <span class="title-i">bamuzi@foxmail.com</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot" id="forb">
                                账&nbsp;户&nbsp;密&nbsp;码:&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" name="" id=""><br>
                                新注册邮箱： <input type="password" name="" id=""><br>
                                <button id="conserve">保存</button>
                                <button class="cancel" id="forr">取消</button>
                            </div>
                        </div>

                        <!-- 5 -->
                        <div class="username" id="ive">
                            <h3 class="clearfix">通知邮箱
                                <a href="javascript:;" id="iva">修改</a>
                            </h3>
                            <div class="amend-bottom" id="ivb">
                                <span class="title">您的通知邮箱</span>
                                <span class="title-i">bamuzi@foxmail.com</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot" id="ivc">
                                <span class="newlogin">新通知邮箱: </span>
                                <input type="text"><br>
                                <button id="conserve">保存</button>
                                <button class="cancel" id="ivo">取消</button>
                            </div>
                        </div>
                        <!-- 6 -->
                        <div class="username" id="six">
                            <h3 class="clearfix">回复通知类型
                                <a href="javascript:;" id="sixa">修改</a>
                            </h3>
                            <div class="amend-bottom" id="sixb">
                                <span class="title">您的回复通知类型</span>
                                <span class="title-i">邮件</span>
                            </div>
                            <!--  -->
                            <div class="amend-bot" id="sixc">
                                <span class="newlogin">回复通知类型: </span>
                                <select name="" id="">
                                    <option value="">无</option>
                                    <option value="" selected>邮件</option>
                                    <option value="">短信息</option>
                                    <option value="">邮件和短信息</option>
                                </select>
                                <br>
                                <button id="conserve">保存</button>
                                <button class="cancel" id="sixx">取消</button>
                            </div>
                        </div>




                    </div>
                </div>
            </div>
        </div>


        <!-- 4.底部 -->
        <div class="foot">
            <!-- 版心 -->
            <div class="account-common">
                <!-- 4.1底部内容 -->
                <div class="foot-top">
                    <a href="" class="foot-i">关于博客园</a>
                    <a href="" class="foot-i">联系我们</a>
                    <a href="" class="foot-i">广告服务</a>
                    <a> @2004-2019</a>
                    <a href="" class="foot-i">博客园</a>
                    <a>Powered by ASP.NET Core on Linux</a>
                </div>
            </div>
        </div>




    </div>
</body>
<script src="./js/bmz-account.js"></script>
<script src="./js/jquery-3.4.1.js"></script>
<script>
    $('#conserve').on('click', function(){
        console.log(1111);
        let priceData = $('#price').val();
        let userId = $(this).data('id');
        $.ajax({
            type: 'post',
            url: '/price',
            data: priceData,
            success: function(data){
                if(data.code == '1201'){
                    alert(message);
                }
            }
        })
    })






</script>

</html>